<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>workspace</title>

<link rel="stylesheet" href="js/easyui-1.3.0/themes/default/easyui.css" />
<link rel="stylesheet" href="js/easyui-1.3.0/themes/icon.css" />
<link rel="stylesheet" href="js/uploadify/uploadify.css" />
<script src="js/jquery/jquery-1.8.2.js"></script>
<script src="js/easyui-1.3.0/jquery.easyui.min.js"></script> 
<script src="js/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript">
var select=null;
var tree=null;
var oldPath="";
var path="";
$(function(){
	
	//url:'loadjson?data=project',
	// used when modify filename
	
	tree = $('#tree').tree({
		url:'loadtree?path='+path,
		onBeforeExpand:function(node,param){
			path=getFullPath(node);
			$(this).tree('options').url='loadtree?path='+path;
		},
		onBeforeLoad:function(node,param){
		},
		onClick:function(node){
			tree.tree('select', node.target);
			select = node.target;
			path=getFullPath(node);
			$('#path').val(path);
			$('#type').val(node.attributes.type);
		},
		onDblClick:function(node){
			nodeClick(node);
		},
		onCancelEdit :function(node){
			tree.tree('endEdit',node.target);
		},
		onBeforeEdit :function(node){
			oldPath=getOldPath(node);
			$('#type').val(node.attributes.type);
		},
		onAfterEdit :function(node){
			$('#oldPath').val(oldPath);
			path=getFullPath(node);
			$('#path').val(path);
			if(path==oldPath){
				return;
			}
			//alert($('#type').val());
			$('#editNode').click();
		},
		onContextMenu: function(e,node){
			e.preventDefault();
			// select the node
			tree.tree('select', node.target);
			select = node.target;
			path=getFullPath(node);
			$('#path').val(path);
			$('#type').val(node.attributes.type);
			// display context menu
			$('#popupMenu').menu('show', {
				left: e.pageX,
				top: e.pageY
			});
		}
	});
	
	
	
	$('#uploadPanel').window('close');
});

function onEditChange(filepath){
	var tab = $('#tt').tabs('getSelected');
	var title =tab.panel('options').title;
	var sp =$(".tabs-title:contains("+title+")"); 
	sp.text('* '+title);
}

function onEditorSave(filepath){
	var tab = $('#tt').tabs('getSelected');
	var title =tab.panel('options').title;
	var sp =$(".tabs-title:contains("+title+")"); 
	sp.text(title)
}
function go(url){
	$('#frame').attr('src',url);
}
function newPackage(top){
	var parent=tree.tree('getSelected');
	if(top==false){
		if(parent!=null && parent.attributes.type=='file') {
			alert('can not add package below file!');
			return;
		}
	}else{
		parent=null;
	}
	
	var node = eval({id:'New Package',text:'New Package',state:'closed',attributes:{'type':'package','isNew':true}});
	tree.tree('append',{
		parent:parent==null?null:parent.target,
		data:[node]
	});
	var children = tree.tree('getChildren',parent==null?null:parent.target);
	tree.tree('select', children[children.length-1].target);
	tree.tree('beginEdit',children[children.length-1].target);
}
function newFile(top){
	var parent=tree.tree('getSelected');
	if(top==false){
		if(parent!=null && parent.attributes.type=='file') {
			alert('can not add file below file!');
			return;
		}
	}else{
		parent = null;
	}
	
	var node=eval({id:'New File',text:'New File',attributes:{'type':'file','isNew':true}});
	tree.tree('append',{
		parent:parent==null?null:parent.target,
		data:[node]
	});
	var children = tree.tree('getChildren',parent==null?null:parent.target);
	tree.tree('select', children[children.length-1].target);
	tree.tree('beginEdit',children[children.length-1].target);
}

function Delete(){
	if(window.confirm('do you really want to delete?')==false){
		return;
	}
	var title = getLeafOfPath(path);
	if($('#tt').tabs('exists',title)){
		$('#tt').tabs('close',title);
	}
	tree.tree('remove',select);
	$('#removeNode').click();
}

function editSelected(){
	var node = tree.tree('getSelected');
	var oldName=getLeafOfPath(oldPath);
	//alert(oldName);
	tree.tree('update',{
		target:node.target,
		text:oldName
	});
	tree.tree('beginEdit',node.target);
}

function getLeafOfPath(tmpPath){
	var arr = tmpPath.split("/");
	return arr[arr.length-1];
}

function nodeClick(node){
	if(node==null){
		node = tree.tree('getSelected');
	}
	if(node==null){
		return;
	}
	if(node.attributes.type=='package'){
		return;
	}
	path=getFullPath(node);
	//$('#editFile').click();
	//go('editFile?path'+path);
	addEditor('editFile?path='+path);
}
function addEditor(url){
	var title = getLeafOfPath(path);
	if($('#tt').tabs('exists',title)){
		$('#tt').tabs('select',title);
		return;
	}
	$('#tt').tabs('add',{
		title:title,
		content:createFrame(url),
		closable:true
	});	
}
function createFrame(url){
	var s="<iframe src='"+url+"' style='border:0px;width:100%;height:100%' />"
	return s;
}
function getFullPath(node){
	var tmpPath=node.text;
	var parent=tree.tree('getParent',node.target);
	if(parent==null){
		return tmpPath;
	}else{
		return getFullPath(parent)+"/"+tmpPath;
	}
}

function getOldPath(node){
	if(node.attributes.isNew!=false){
		return "";
	}
	var tmpPath=node.text;
	var parent=tree.tree('getParent',node.target);
	if(parent==null){
		return tmpPath;
	}else{
		return getOldPath(parent)+"/"+tmpPath;
	}
}

function updateNodeState(){
	var node = tree.tree('getSelected');
	var attrs = node.attributes;
	attrs.isNew=false;
	if(node){
		tree.tree('update',{
			target:node.target,
			attributes:attrs
		});
	}
	//alert(tree.tree('getSelected').attributes.isNew);
}
function openUploadWindow(){
	if(tree.tree('getSelected').attributes.type=='file'){
		return;
	}
	try{
		$("#file_upload").uploadify('destroy');
	}catch(e){
		
	}
	var uploader =  'uploadFile?username='+$('#username').val()+'&path='+path;
	//var sid=$('#jsessionId').val();
	//alert(uploader);
	$("#file_upload").uploadify({
        'swf'              : '/online/js/uploadify/uploadify.swf',
        'auto'			   : true,
        'multi'			   : true,
        'removeCompleted'  : false,
        'removeTimeout'    : 10,
        'uploader'         : uploader
    });
	$('#uploadPanel').window('open');
}

function refresh(){
	var node = tree.tree('getSelected');
	//node.state="closed";
	tree.tree('reload',node.target);
	//tree.tree('expand',node.target);
}

function runAsAction(){
	var url = 'runAction2?path='+path
	window.open(url);
}

function rename(){
	var node = tree.tree('getSelected');
	tree.tree('beginEdit',node.target);
}
function view(){
	var url="app/"+$('#username').val()+"/"+path;
	window.open(url);
}

function copy(){
	$('#copyPath').val(path);
}
function search(){
	
}
</script>
</head>
<body class="easyui-layout" scroll=no >
<div data-options="region:'north',border:false,fill:true" style="background:#B3DFDA;padding:0px">
	<div style="float:left;padding-left:10px;">
		<image src='css/images/logo.png' style="height:25px;width:60px"></image>
	</div>
<!-- 	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" data-options="menu:'#newSubMenu',iconCls:'icon-add'">新建</a> -->
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" data-options="menu:'#popupMenu'">文件</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" data-options="">范例</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" >意见</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" >消息</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" data-options="menu:'#settingMenu'">设置</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" >关于</a>
	<a style="padding-left:5px;" href="javascript:void(0)" class="easyui-menubutton" onclick="javascript:$('#logout').click()">退出</a>
<!-- 	<div style="float:right;width:200px">can what be online?</div> -->
	
	<div style="float:right;">
		<input id="ss" class="easyui-searchbox" style="width:300px;"  
        data-options="searcher:search,prompt:'What do you want?',menu:'#searchType'"></input>  
          
		<div id="searchType" style="width:50px;">  
		    <div data-options="name:'api',iconCls:'icon-ok'">API</div>  
		</div>
	</div>
	
</div>
<div data-options="region:'west',split:true,title:'Explorer'" style="width:200px;padding:10px;">
	<ul id="tree" class="easyui-tree" data-options="animate:false"></ul>
	
	<form wicket:id="ajaxForm" style="display:none">
		<input type="hidden" name="oldPath" id="oldPath"/>
		<input type="hidden" name="path" id="path"/>
		<input type="hidden" name="copyPath" id="copyPath"/>
		<input type="hidden" name="type" id="type"/>
		<a href="javascript:void(0)" id="editNode" wicket:id="editNode"></a>
		<a href="javascript:void(0)" id="removeNode" wicket:id="removeNode"></a>
		<a href="javascript:void(0)" id="paste" wicket:id="paste"></a>
	</form>
	<a href="javascript:void(0)" id="logout" wicket:id="logout" style="display:none"></a>
</div>

<div data-options="region:'center',title:''">
	<div id="tt" class="easyui-tabs" fit='true' border='false'>
	</div>
</div>
<div data-options="region:'south',border:false" style="height:30px;background:#A9FACD;padding:10px;text-align:center">
@2013 All rights reserved Online, Inc. 
</div>

<div id="settingMenu" class="easyui-menu" style="position:absolute;width:120px;">
	<div><a href="javascript:window.open('accounts');">账号管理</a></div>
	<div onclick="openSettingWindow()">修改密码</div>
</div>
<div id="popupMenu" class="easyui-menu" style="position:absolute;width:120px;">
	<div>
		<span>新文件夹</span>
		<div style="width:100px;">
			<div onclick="newPackage(true)">顶层文件夹</div>
			<div onclick="newPackage(false)">子文件夹</div>
		</div>
	</div>
	<div>
		<span>新文件</span>
		<div style="width:100px;">
			<div onclick="newFile(true)">顶层文件</div>
			<div onclick="newFile(false)">子文件</div>
		</div>
	</div>
	<div onclick="nodeClick()">编辑</div>
	<div onclick="openUploadWindow()">上传</div>
	<div class="menu-sep"></div>
	<div onclick="refresh()">刷新</div>
	<div onclick="rename()">重命名</div>
	<div onclick="Delete()">删除</div>
	<div onclick="view()">查看</div>
	<div class="menu-sep"></div>
	<div onclick='copy()'>复制</div>
	<div onclick="javascript:$('#paste').click()">粘贴</div>
</div>
<!-- 
<div id="newSubMenu" class="easyui-menu" style="position:absolute;width:120px;">
	<div onclick="javascript:select=null;newPackage(true)">New Project</div>
	<div onclick="javascript:select=null;newFile()">New File</div>
</div>
<div id="downloadSubMenu" class="easyui-menu" style="position:absolute;width:120px;">
	<div><a href="online/download">工程</a></div>
	<div><a href="download">平台</a></div>
</div>
 -->
<div id="uploadPanel" title="upload file" class="easyui-window" data-options="width:400,height:400">
	<input type="file" name="file_upload" id="file_upload" />
</div>

<input type="hidden" id="username" wicket:id="username"/>
</body>
</html>